import { ReactNode } from 'react'
import { IItemArray } from './index'
import { Input, DatePicker, InputNumber, Switch, Select, Cascader, Radio, TreeSelect, Transfer } from 'antd'
import Upload from '@/components/Upload'

export default function getComponents(item: IItemArray): ReactNode {
  const ComponentType: { [key: string]: ReactNode } = {
    TreeSelect: <TreeSelect placeholder={item.placeholder || `请选择${item.label}`} {...item.config} />,
    Search: <Input.Search placeholder={item.placeholder || `请输入${item.label}`} {...item.config} />,
    Input: <Input placeholder={item.placeholder || `请输入${item.label}`} {...item.config} />,
    Password: <Input.Password placeholder={item.placeholder || `请输入${item.label}`} {...item.config} />,
    TextArea: <Input.TextArea placeholder={item.placeholder || `请输入${item.label}`} {...item.config} />,
    Upload: <Upload {...item.config} />,
    InputNumber: (
      <InputNumber style={{ width: '100%' }} placeholder={item.placeholder || `请输入${item.label}`} {...item.config} />
    ),
    Select: (
      <Select
        {...item.config}
        placeholder={item.placeholder || `请选择${item.label}`}
        options={item?.option}
        allowClear
      />
    ),
    Switch: <Switch {...item.config} />,
    DatePicker: (
      <DatePicker style={{ width: '100%' }} placeholder={item.placeholder || `请选择${item.label}`} {...item.config} />
    ),
    RangePicker: <DatePicker.RangePicker {...item.config} />,
    Cascader: <Cascader placeholder={item.placeholder || `请选择${item.label}`} {...item.config} />,
    Radio: <Radio.Group {...item.config} />,
    Transfer: <Transfer {...item.config} />,
    Custom: item?.slot,
  }
  return item.type ? (
    ComponentType[item.type]
  ) : (
    <Input placeholder={item.placeholder || `请输入${item.label}`} {...item.config} />
  )
}
